<template>
  <el-row class="mb-1">
    <!--新增按钮-->
    <el-button type="primary" icon="el-icon-plus"  @click="openRelationDDialog(null,parentClickRow)">
      {{ $t('operation.add') }}
    </el-button>
    <!--删除按钮-->
    <el-button :disabled="multiple" type="danger" icon="el-icon-delete" @click="deleteRow(selectObjs)">{{ $t('btn.delete') }}</el-button>
  </el-row>
  <el-table :data="state.dataList" v-loading="state.loading" border
            @selection-change="selectionChangeHandle" highlight-current-row
            :cell-style="tableStyle.cellStyle" :header-cell-style="tableStyle.headerCellStyle"
            style="width: 100%;height: 100%">
    <el-table-column type="selection"/>
    <el-table-column prop="checkProjectName" disabled :label="$t('qms.testItem')"/>
    <el-table-column prop="checkProjectCode" disabled :label="$t('qms.testItemCode')"/>
    <el-table-column prop="testTypeName" disabled :label="$t('qms.testCategories')"/>
    <el-table-column prop="testTypeCode" disabled :label="$t('qms.testCode')"/>
    <el-table-column prop="standardItem" disabled :label="$t('qms.standardValue')"/>
    <el-table-column prop="unit" disabled :label="$t('iot.unit')"/>
    <el-table-column prop="checkMaterialCode" disabled :label="$t('qms.checkMaterialCode')"/>
    <el-table-column prop="resultType" disabled :label="$t('qms.resultType')">
      <template #default="scope">
        <el-tag :type="scope.row.resultType === 'option' ? 'success' : 'danger'" >
          {{ scope.row.resultType === 'option' ? $t('qms.options') : $t('qms.numericalValue') }}
        </el-tag>
      </template>
    </el-table-column>
    <el-table-column fixed="right" :label="$t('operation.Operation')">
      <template #default="scope">
        <el-button type="primary" icon="edit" v-auth="'platform_basDicSet_edit'"
                   @click="openRelationDDialog(scope.row,parentClickRow)"></el-button>
        <el-button  type="danger" icon="delete" @click.prevent="deleteRow([scope.row.id])"></el-button>
      </template>
    </el-table-column>
  </el-table>
  <pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination"/>
  <pqcForm ref="pqcFormRef1" @refresh="getDataList(false)"/>
  <otherForm ref="otherFormRef" @refresh="getDataList(false)"/>
</template>

<script setup lang="ts">
import {BasicTableProps, useTable} from "/@/hooks/table";
import {useMessage, useMessageBox} from "/@/hooks/message";
import {delQmsRelationD, fetchList} from "/@/api/platform/qms/qmsRelationD";
import {useI18n} from "vue-i18n";

const {t} = useI18n();

const pqcForm = defineAsyncComponent(() => import('./pqcForm.vue'));
const otherForm = defineAsyncComponent(() => import('./otherForm.vue'));

const pqcFormRef1 = ref()
const otherFormRef = ref()


const state: BasicTableProps = reactive<BasicTableProps>({
  queryForm: {},
  pageList: fetchList
})


const openRelationDDialog = (childRow: any, parentRow: any) => {
  console.log(parentRow)
  console.log(childRow)
  if (!parentRow?.id) {
    useMessage().error(t('qms.pleaseSelectTestData'));
    return
  }
  if (parentRow === null || parentRow.checkType === null) {
    useMessage().error(t('qms.pleaseSelectTestData'));
  }
  if (parentRow.checkType === 'PQC') {
    pqcFormRef1.value.openDialog(childRow, parentRow);
  } else {
    otherFormRef.value.openDialog(childRow, parentRow);
  }
}


//删除
const deleteRow = (ids: Array<number>) => {
  useMessageBox().confirm(t('operation.permanentDeletion')).then(() => {
    // 删除逻辑
    delQmsRelationD(ids).then(() => {
      // 刷新表格逻辑
      getDataList(false)
    })
  });
}


const {
  getDataList,
  currentChangeHandle,
  sizeChangeHandle,
  tableStyle
} = useTable(state)

// 多选变量
const selectObjs = ref([]) as any
const multiple = ref(true)

// 父级点击的行
let parentClickRow = {}

// 多选事件
const selectionChangeHandle = (objs: { id: string }[]) => {
  selectObjs.value = objs.map(({id}) => id);
  multiple.value = !objs.length;
};

// 通过id进行子表的查询
const query = (row: Object) => {
  if (row == null) {
    parentClickRow = {}
    return;
  }
  // 赋值查询参数
  state.queryForm.masterId = row.id
  // 保存选中的行数据
  Object.assign(parentClickRow, row)
  // 刷新子表数据
  getDataList()
}

// 暴露变量
defineExpose({
  query
});
</script>
